<template>
    <innerCommon 
            :location="location"
        >
        <template slot="left">
            <span>实操题</span>
        </template>
        <template slot="right">
            <a-button type="primary" @click="returnBack()">返回</a-button>
        </template>
        <div slot="table" class="tableWrap">
            <eform
                :formData="formData"
                class="form"
                ref="form"
                >
                <div slot="stem">
                    <eQuill
                        @getQuillContent="getQuillContent($event,'stem')"
                        v-decorator="['stem',{rules: [{ required: true, message: '请输入题干内容' }]}]"
                        :defaultData="quillStemInfo"
                    ></eQuill>
                </div>
                <div slot="analyse">
                    <eQuill
                        @getQuillContent="getQuillContent($event,'analyse')"
                        v-decorator="['analyse',{rules: [{ required: true, message: '请输入解析内容' }]}]"
                        :defaultData="quillAnaylseInfo"
                    ></eQuill>
                </div>
            </eform>
            <div class="submitBtn">
                <a-button @click="returnBack()">取消</a-button>
                <a-button type="primary" @click="save()">保存</a-button>
            </div>
        </div>
    </innerCommon>
</template>
<script>
import eform from "@/components/common/form"
import innerCommon from "@/components/common/innerCommon"
import eQuill from "@/components/common/eQuill"
import {submitQuestionApi,updateQuestionApi,updateTestApi} from "@/request/api"
export default {
    name:"questionAction",
    components:{innerCommon,eform,eQuill},
    created(){
        if(this.$route.query.item){//如果是修改实操题
            let info=JSON.parse(this.$route.query.item)
            if(!this.$route.query.type){//题库部分修改
                this.questionItemId=this.$route.query.id
                this.questionItemTitle=JSON.parse(this.$route.query.title)
                if(info){
                    this.type=1
                    this.questionId=info.id
                }else{
                    this.type=0
                }
                this.location=[{
                    name:"教学课堂管理",
                    path:''
                },{
                    name:"题库列表",
                    path:'/questionBank'
                },{
                    name:this.questionItemTitle,
                    path:'/questionAdd?id='+this.questionItemId+'&title='+JSON.stringify(this.questionItemTitle)
                },{
                    name:"实操题",
                    path:'/questionAction?id='+this.questionItemId+'&title='+JSON.stringify(this.questionItemTitle)
                }]
            }else{//我的测试和考试修改
                this.examOrTest=this.$route.query.type
                this.location=[{
                    name:"教学课堂管理",
                    path:''
                },{
                    name:this.$route.query.type==1?"我的测试":'我的考试',
                    path:this.$route.query.type==1?'/myTest':'/myExam'
                }]
            }
            this.quillStemInfo=info.title
            this.quillAnaylseInfo=info.analyse
            this.questionId=info.id
        }else{//题库新增
            this.questionItemTitle=JSON.parse(this.$route.query.title)
            this.questionItemId=this.$route.query.id
            this.location=[{
                name:"教学课堂管理",
                path:''
            },{
                name:"题库列表",
                path:'/questionBank'
            },{
                name:this.questionItemTitle,
                path:'/questionAdd?id='+this.questionItemId+'&title='+JSON.stringify(this.questionItemTitle)
            },{
                name:"实操题",
                path:'/questionAction?id='+this.questionItemId+'&title='+JSON.stringify(this.questionItemTitle)
            }]
        }
        
    },
    data(){
        const formData=[
            {
                label:"题干",
                scopedSlots: { customRender: 'stem'},
            },{
                label:"解析",
                scopedSlots: { customRender: 'analyse'},
            },
        ]
        return{
            formData,
            questionItemId:null,
            questionItemTitle:'',
            location:[],
            type:0,//0新增 1修改
            quillStemInfo:'',
            quillAnaylseInfo:'',
            questionId:null
        }
    },
    methods:{
        returnBack(){
            this.$router.go(-1)
        },
        getQuillContent(data,type){
            if(type=='stem'){
                this.quillStemInfo=data
                this.$refs.form.form.setFieldsValue({['stem']:data})
            }else{
                this.quillAnaylseInfo=data
                this.$refs.form.form.setFieldsValue({['analyse']:data})
            }
        },
        save(){
            this.$refs.form.form.validateFields().then(res=>{
                if(this.examOrTest){
                    let question=JSON.parse(this.$route.query.question)
                    question.forEach(item=>{
                        if(item.id==this.questionId){
                            item.title=res.stem
                            item.analyse=res.analyse
                        }
                    })
                    this.getToken(updateTestApi,{'paperId':this.$route.query.paperId,question},res=>{
                        this.$message.success(res.message)
                        this.$router.go(-1)
                        
                    })
                    return
                }
                this.getToken(this.type==0?submitQuestionApi:updateQuestionApi,{
                    'libId':this.questionItemId,
                    'title':res.stem,
                    'analyse':res.analyse,
                    'type':3,
                    'questionId':this.type==0?'':this.questionId
                },()=>{
                    this.$message.success('操作成功')
                    this.returnBack()
                })
            })
        }
    }
}
</script>